.coustomer-created{

  .step-ul{
    // padding: 15px 18px 15px 0px;
    display: flex;
    justify-content: space-between;
    li{
      &.li-content{
        flex: 2;
        text-align: center;
        display: flex;
        flex-direction: column;
        align-items: center;
        .img-box{
          display: inline-block;
          cursor: pointer;
          width: 72px;
          height: 72px;
          border-radius: 50%;
          border: 1px solid #e5e5e5;
          background-position: center;
          background-repeat: no-repeat;
          &.style-1{
            background-image: url('../../../../assets/images/coustomer/step-jbxx-1.png');
          }
          &.style-2{
            background-image: url('../../../../assets/images/coustomer/step-yyzz-1.png');
          }
          &.style-3{
            background-image: url('../../../../assets/images/coustomer/step-fyxx-1.png');
          }
          &.style-4{
            background-image: url('../../../../assets/images/coustomer/step-htxx-1.png');
          }
          &.style-5{
            background-image: url('../../../../assets/images/coustomer/step-cbxx-1.png');
          }
          &.style-6{
            background-image: url('../../../../assets/images/coustomer/step-xzfj-1.png');
          }
        }
        .text{
          white-space:nowrap;
        }
      }
      &.line{
        flex: 2;
        padding: 0 15px;
        position: relative;
        .line-div{
          width: 100%;
          border-top: 4px dotted #e5e5e5;
          position: absolute;
          top: 35px;
          left: 0;
        }
        &:first-child{
          display: none;
        }
      }
      &.active{
        &.li-content{
          .img-box{
            border: 1px solid #6edaff;
            &.style-1{
              background-image: url('../../../../assets/images/coustomer/step-jbxx-3.png');
            }
            &.style-2{
              background-image: url('../../../../assets/images/coustomer/step-yyzz-3.png');
            }
            &.style-3{
              background-image: url('../../../../assets/images/coustomer/step-fyxx-3.png');
            }
            &.style-4{
              background-image: url('../../../../assets/images/coustomer/step-htxx-3.png');
            }
            &.style-5{
              background-image: url('../../../../assets/images/coustomer/step-cbxx-3.png');
            }
            &.style-6{
              background-image: url('../../../../assets/images/coustomer/step-xzfj-3.png');
            }
          }
        }
        &.line{
          .line-div{
            border-top: 4px solid #6edaff;
          }
        }
        &:last-child + li{
          .line-div{
            border-top: 4px dotted #6edaff;
          }
        }
      }
    }
  }
}